{% extends 'base.html' %}
{% block title %}
    文章详情
{% endblock %}
{% block styles %}
    {{ super() }}
    <style>
        #detail {
            width: 600px;
            height: 500px;
        }
    </style>
{% endblock %}
{% block newcontent %}
    <div id="detail" class="col-md-offset-4">
        <p>{{ article.title }}</p>
        <p>{{ article.user.username }}</p>
        <p>{{ article.article_type.type }}</p>
        <p>{{ article.content | decode_detail | safe }}</p>
        <p>{{ article.pdatetime }}</p>
        <span class="glyphicon glyphicon-heart"></span><span>{{ article.save_num }}</span>&nbsp;&nbsp;
        <span class="glyphicon glyphicon-thumbs-up"></span><span>{{ article.love_num }}</span>
    </div>
{% endblock %}
{% block scripts %}
    {{ super() }}
    <script>
        $(function () {
            //收藏点击事件
            let if_save = 0
            let if_love = 0
            $('.glyphicon-heart').click(function () {
                if_save += 1
                if (if_save % 2 === 1) {
                    $.get('{{ url_for('article.article_save') }}', {aid:{{article.id}}}, function (data) {
                        $('.glyphicon-heart').next('span').text(data.num);
                        $('.glyphicon-heart').css({'color': 'red'});
                    });

                } else {
                    $.get('{{ url_for('article.article_desave') }}', {aid:{{article.id}}}, function (data) {
                        $('.glyphicon-heart').next('span').text(data.num);
                        $('.glyphicon-heart').css({'color': 'black'});
                    });

                }

            });
            //点赞点击事件
            $('.glyphicon-thumbs-up').click(function () {
                if_love += 1
                if (if_love % 2 === 1) {
                    $.get('{{ url_for('article.article_love') }}', {aid:{{article.id}}}, function (data) {
                        $('.glyphicon-thumbs-up').next('span').text(data.num);
                        $('.glyphicon-thumbs-up').css({'color': 'red'});
                    });
                } else {
                    $.get('{{ url_for('article.article_delove') }}', {aid:{{article.id}}}, function (data) {
                        $('.glyphicon-thumbs-up').next('span').text(data.num);
                        $('.glyphicon-thumbs-up').css({'color': 'black'});
                    });
                }
            });
        });
    </script>
{% endblock %}